export function ringOpt(data, name) {
	return {
		color: data.color || [
			'#1890FF',
			'#91CB74',
			'#FAC858',
			'#EE6666',
			'#73C0DE',
			'#3CA272',
			'#FC8452',
			'#9A60B4',
			'#ea7ccc'
		],
		padding: [0, 0, 0, 0],
		rotate: false,
		errorReload: true,
		fontSize: 13,
		fontColor: '#666666',
		enableScroll: false,
		touchMoveLimit: 60,
		enableMarkLine: false,
		dataLabel: false,
		dataPointShape: false,
		dataPointShapeType: 'solid',
		tapLegend: true,
		disabled: false,
		legend: {
			show: data.legend ? data.legend.show : false
		},

		series: [
			{
				name: name,
				type: 'pie',
				animationEasing: 'linear',
				// radius: ['50%', '90%'],
				radius: data.type == 'pie' ? '90%' : ['40%', '80%'],

				label: {
					show: false,
					position: 'center',
					formatter: function (lable) {
						return [
							`{d|${lable.data.value}}{d|%}`,
							`{b|${lable.data.name && lable.data.name.length > 6 ? lable.data.name.slice(0, 5) + '...' : lable.data.name}}`
						].join('\n');
					},

					rich: {
						d: {
							fontSize: '18',
							fontWeight: 'bold',
							lineHeight: '22'
						},
						b: {
							fontSize: '12',
							color: '#999999'
						},
					}
				},
				itemStyle: {
					borderColor: '#fff',
					borderWidth: 2
				},
				emphasis: {
					label: {
						show: data.type == 'pie' ? false : true,
						// position: 'center',
						color: '#333',
						// fontSize: '30',
					},
				},
				labelLine: {
					show: false,
				},
				data: data.data
				//  [
				// 	{ value: 1048, name: '搜索引擎' },
				// 	{ value: 735, name: '直接访问' },
				// 	{ value: 580, name: '邮件营销' },
				// 	{ value: 484, name: '联盟广告' },
				// 	{ value: 300, name: '视频广告' }
				// ]
			}
		]
	};
}
export function ringOptShowTitle(data, name) {
	return {
		color: data.color || [
			'#1890FF',
			'#91CB74',
			'#FAC858',
			'#EE6666',
			'#73C0DE',
			'#3CA272',
			'#FC8452',
			'#9A60B4',
			'#ea7ccc'
		],
		title: {
			show: data.showTitle ? true : false,
			text: data.showTitle.text,
			subtext: data.showTitle.subtext,
			left: 'center', // 标题水平居中
			top: '34%',
			textStyle: {
				color: '#333',
				fontSize: 18,
				fontWeight: 'normal',
				align: 'center',
			},
			subtextStyle: {
				rich: {
					a: {
						color: 'red',
						lineHeight: 10
					},
					b: {
						backgroundColor: {
							image: 'xxx/xxx.jpg'
						},
						height: 40
					},
					x: {
						fontSize: 18,
						fontFamily: 'Microsoft YaHei',
						borderColor: '#449933',
						borderRadius: 4
					},
				}

			},
			x: 'center',
			y: 'center',
		},
		padding: [0, 0, 0, 0],
		rotate: false,
		errorReload: true,
		fontSize: 13,
		fontColor: '#666666',
		enableScroll: false,
		touchMoveLimit: 60,
		enableMarkLine: false,
		dataLabel: false,
		dataPointShape: false,
		dataPointShapeType: 'solid',
		tapLegend: true,
		disabled: false,
		legend: {
			show: data.legend ? data.legend.show : false
		},

		series: [
			{
				name: name,
				type: 'pie',
				animationEasing: 'linear',
				// radius: ['50%', '90%'],
				radius: data.type == 'pie' ? '90%' : ['50%', '90%'],

				label: {
					show: false,
					position: 'center',
					formatter: function (lable) {
						return [
							`{d|${lable.data.value}}{d|%}`,
							`{b|${lable.data.name && lable.data.name.length > 6 ? lable.data.name.slice(0, 5) + '...' : lable.data.name}}`
						].join('\n');
					},

					rich: {
						d: {
							fontSize: '18',
							fontWeight: 'bold',
							lineHeight: '22'
						},
						b: {
							fontSize: '12',
							color: '#999999'
						},

					}
				},
				itemStyle: {
					borderColor: '#fff',
					borderWidth: 2
				},
				emphasis: {
					label: {
						show: data.type == 'pie' ? false : true,
						// position: 'center',
						color: '#333',
						// fontSize: '30',

					},
				},
				labelLine: {
					show: false
				},
				data: data.data
				//  [
				// 	{ value: 1048, name: '搜索引擎' },
				// 	{ value: 735, name: '直接访问' },
				// 	{ value: 580, name: '邮件营销' },
				// 	{ value: 484, name: '联盟广告' },
				// 	{ value: 300, name: '视频广告' }
				// ]
			}
		]
	};
}

export function ringDashboard(data) {
	return {
		series: [
			// 进度条
			{
				name: '仪表盘',
				type: 'gauge',
				radius: '100%', // 半径
				startAngle: 180, // 开始角度 左侧角度
				endAngle: 0, // 结束角度 右侧
				splitNumber: 10,
				axisLine: {
					lineStyle: {
						color: [
							[(data.notDelPlanPct / 100), {
								type: 'linear',
								colorStops: [
									{ offset: 0, color: '#00C4FF' },
									{ offset: 1, color: '#0091FF' },
								],
							}],
							[1, '#DCF0FF'], // 阴影色

						],
						width: 15,
					},
				},
				axisLabel: {
					show: false,
				},
				axisTick: {
					show: false,
				},
				splitLine: {
					show: false,
				},
				itemStyle: {
					show: false,
				},
				detail: {
					formatter: function (value) {
						return [
							`{d|${data.notDelPlanPct}}{d|%}`,
							`{b|${data.name}}`
						].join('\n');
					},
					rich: {
						d: {
							fontSize: '28',
							fontWeight: 'bold',
							color: '#333333'
						},
						b: {
							fontSize: '12',
							fontWeight: '400',
							color: '#999999'
						},
					},
					offsetCenter: [0, '0%'],
				},
				title: {
					show: false,
					offsetCenter: [0, '100%'],
				},
				pointer: {
					show: false,
				},
				data: [
					{
						value: data.notDelPlanPct,
					},
				],
			},
			// 外圈
			{
				name: '仪表盘',
				type: 'gauge',
				radius: '100%', // 半径
				startAngle: 180, // 开始角度 左侧角度
				endAngle: 0, // 结束角度 右侧
				splitNumber: 10,
				axisLine: {
					lineStyle: {
						color: [
							[1, {
								type: 'linear',
								colorStops: [
									{ offset: 0, color: '#DCF0FF' },
									{ offset: 0.5, color: '#0091FF' },
									{ offset: 1, color: '#DCF0FF' },
								],
							}],
						],
						width: 1, // 线条宽度
					},
				},
				axisLabel: {
					show: false,
				},
				axisTick: {
					show: false,
				},
				splitLine: {
					show: false,
				},
				itemStyle: {
					show: false,
				},
				pointer: {
					show: false,
				},
			},
		],
	};
}

export function pieLine(data) {
	return {
		color: data.color,
		series: [
			{
				type: 'pie',
				radius: '70%',
				label: {
					position: 'outside',
					formatter: function (lable) {
						return [
							`{b|${lable.data.name && lable.data.name.length > 6 ? lable.data.name.slice(0, 5) + '...' : lable.data.name}}`,
							`{d|${lable.data.eleTotal}}{d|台}`,
							`{e|(${lable.data.value}}{e|%)}`
						].join('\n');
					},
					rich: {
						b: {
							fontSize: '13',
							color: '#333',
							align: 'center'
						},
						d: {
							fontSize: '13',
							lineHeight: '18',
							color: '#333',
							align: 'center'
						},
						e: {
							fontSize: '13',
							lineHeight: '18',
							color: '#666',
							align: 'center'
						}
					}
				},
				data: data.data
			}
		]
	};
}

export function pieOpt(data) {
	return {
		color: data.color || [
			'#1890FF',
			'#91CB74',
			'#FAC858',
			'#EE6666',
			'#73C0DE',
			'#3CA272',
			'#FC8452',
			'#9A60B4',
			'#ea7ccc'
		],
		type: 'pie',
		canvasId: '',
		type2d: true,
		canvas2d: true,
		background: 'none',
		animation: true,
		timing: 'easeOut',
		duration: 1000,
		padding: data.padding ? data.padding : [0, 0, 0, 0],
		rotate: false,
		errorReload: true,
		fontSize: 13,
		fontColor: '#666666',
		enableScroll: false,
		touchMoveLimit: 60,
		enableMarkLine: false,
		dataLabel: data.dataLabel === undefined ? true : data.dataLabel,
		dataLabelWidth: 40,
		dataPointShape: false,
		dataPointShapeType: 'solid',
		tapLegend: true,
		legend: {
			show: false
		},
		title: {
			name: data.title ? data.title.name : '100',
			fontSize: 20,
			fontWeight: 'bold',
			color: '#000',
			offsetX: 0,
			offsetY: 0
		},
		subtitle: {
			name: data.subtitle ? data.subtitle.name : '电梯(台)',
			fontSize: 11,
			color: '#666',
			offsetX: 0,
			offsetY: 0
		},

		extra: {
			pie: {
				centerColor: '#FFFFFF',
				activeOpacity: 0.5,
				activeRadius: 5,
				offsetAngle: 0,
				customRadius: 0,
				labelWidth: 0,
				border: true,
				borderWidth: 0.5,
				borderColor: '#FFFFFF',
				linearType: 'none',

			},

			tooltip: {
				showBox: false
			}
		}
	};
}

// 条形堆叠图
export function setBarOpt2(data) {
	let sizeMax = Math.ceil(Math.max(...data.series[0].data) / 10) * 10;
	if (Math.max(...data.series[0].data) <= 10) {
		sizeMax = Math.max(...data.series[0].data);
	}
	let count = Math.ceil(sizeMax / 4);
	return {
		grid: {
			left: 44,
		},
		// tooltip: {
		// 	backgroundColor: '#FFF',
		// 	trigger: 'axis',
		// 	formatter: function (paramList) {
		// 		const params = paramList[0];
		// 		return params.name + '\n' + params.marker + ' ' + data.name + '  ' + params.value + '台';
		// 	},
		// 	show: true,
		// 	confine: true,
		// 	position: 'right',
		// 	textStyle: {
		// 		textShadowBlur: 1
		// 	},
		// 	extraCssText: 'box-shadow:none;'
		// },
		legend: {
			show: true,
			orient: 'vertical',
			//   align:"left",
			top: 'center',
			left: '50%',
			icon: 'circle',
			// width:220,

			textStyle: {
				fontSize: 13,
				color: '#666',
				rich: {
					name: {
						width: 45,
					},
				},
			},

		},
		xAxis: {
			width: '100%',
			type: 'value',
			min: 0,
			max: count * 4,
			splitNumber: 4,
			interval: count,
			name: '台',
			axisLabel: {
				show: true,
				color: '#999',
				fontSize: 10,
			},
			splitLine: {
				show: true,
				lineStyle: {
					type: 'dashed',
				},
			},
			axisLine: {
				show: true,
				lineStyle: {
					color: '#999',
				},
			},
		},
		yAxis: [
			{
				type: 'category',
				// 是否反向坐标轴
				inverse: true,
				// axisTick 坐标轴刻度相关设置
				axisTick: {
					show: false,
				},
				// axixLine 坐标轴轴线相关设置
				axisLine: {
					lineStyle: {
						color: '#999',
					},
				},
				data: data.categories,
				axisLabel: {
					show: true,
					color: '#999',
					fontSize: 10,
					width: 200,
					overflow: 'break',
					align: 'right',
					margin: 4,
					formatter: function (value) {
						let arr = value.split('');
						let name = [];
						for (let i = 0; i < arr.length; i++) {
							if (i <= 6) {
								name.push(arr[i]);
								if (i === 3) {
									name.push('\n');
								}
							}
							if (i == 7) {
								name.push('...');
							}
						}
						return name.join('');
					},
				},
			},
		],
		series: data.series,
	};
}

// 水球图
export function liquidFill(data) {
	let liqColor = []; // 波浪颜色
	let bgColor = '';  // 球 背景色
	let bmColor = '';  // 底 发光色
	let statusName = data.status == 0 ? '\n{b|电梯维保中}' : `{c|${data.healthScore}}` + '\n{a|健康分}';
	if (data.healthScore <= 75 && data.healthScore > 60) { // 中
		liqColor = ['#f5a100', 'rgba(255,225,84,0.49)'];
		bgColor = '#FFF2C4';
		bmColor = 'rgb(255, 249, 226,.4)';
	} else if (data.healthScore <= 60) {  // 下
		liqColor = ['#ff3d5a', 'rgba(255,92,61,0.40)'];
		bgColor = '#FFDADD';
		bmColor = 'rgb(255, 235, 238,.4)';
	} else {
		liqColor = ['#5b78e3', 'rgba(160,184,255,0.50)'];
		bgColor = '#E8EEFB';
		bmColor = 'rgb(241, 247, 251,.4)';
	}
	return {
		graphic: {
			elements: [{
				type: 'image',
				z: 999,
				style: {
					image: 'https://erised-fresh.oss-cn-shenzhen.aliyuncs.com/592800/8xlpnRlh2VB0b5a88509b521ef9f87c11f097e133616.png',
					width: 139,
					height: 139,
				},
				left: 'center',
				top: 'center',
			}],
		},
		series: [
			{
				type: 'liquidFill',
				radius: '80%',
				animationEasing: 'linear',
				waveAnimation: false, // 关闭波浪动画
				animationDuration: 0, // 动画完成时间
				animationDurationUpdate: 0,  // 动画交替时间
				center: ['50%', '50%'],
				itemStyle: {
					opacity: 0.95,
					shadowColor: 'rgba(0, 0, 0, 0)',
				},
				data: [
					data.healthScore / 100,  // 健康分
					{
						value: data.healthScore / 100,
						direction: 'left', // 波浪方向
					},
				], // data个数代表波浪数
				backgroundStyle: {
					color: bgColor,
				},
				amplitude: 0,  // 波浪的振幅 '6%' 0即为水平
				// 修改波浪颜色
				color: [
					{
						type: 'linear',
						x: 0,
						y: 0,
						x2: 0,
						y2: 1,
						colorStops: [
							{
								offset: 1,
								color: liqColor[0],
							},
							{
								offset: 0,
								color: liqColor[1],
							},
						],
						globalCoord: false,
					},
				],
				label: {
					normal: {
						formatter: statusName + `\n{b|待处理隐患 ${data.unDisposeCounts || 0}}`,
						rich: {
							a: {
								fontSize: 11,
								align: 'center'
							},
							b: {
								fontSize: 12,
								align: 'center',
								padding: [20, 0, 0, 0],
							},
							c: {
								fontSize: 40,
								align: 'center',
							}
						},
						textStyle: {
							fontSize: 48,
							color: '#fff',
						},
					},
				},
				outline: {
					show: false,
				},
			},
			{
				// 外发光
				type: 'pie',
				radius: ['80%', '90%'],
				center: ['50%', '50%'],
				itemStyle: {
					normal: {
						borderWidth: 20,
						color: bgColor,
					},
				},
				label: {
					show: false,
				},
				data: [100],
			},
			{
				// 底层外发光
				type: 'pie',
				radius: ['80%', '100%'],
				center: ['50%', '50%'],
				itemStyle: {
					normal: {
						borderWidth: 20,
						color: bmColor,
					},
				},
				label: {
					show: false,
				},
				data: [100],
			},
		],
	};
}